<!--
 * @Author: tansq
 * @Date: 2022-05-11 17:16:36
 * @LastEditTime: 2022-05-12 14:44:46
 * @LastEditors: tansq
 * @Description: 排序通用组件
 * @FilePath: \vue-riskchk-dev\src\components\tools\SortTag.vue
 * 可以输入预定的版权声明、个性签名、空行等
-->
<template>
  <div  style="margin:16px 0; ">
      <span :style="{ marginRight: 8 }">排序:</span>
        <template v-for="(item) in defaultSortTags" def>
          <a-checkable-tag
            :key="item"
            :checked="selectSortTags.indexOf(item.tag) > -1"
            @change="checked => handleSortChange(item, checked)"

          >
            {{ item.tag}}{{item.asc?'(升序)':'(降序)'}}<a-icon v-if="item.asc" type="sort-ascending"></a-icon>
            <a-icon v-else type="sort-descending" />
          </a-checkable-tag>
        </template>
  </div>
</template>

<script>
export default {
  name: 'SortTag',
  components: {
  },
  props:{
      sortTags:{
          type:Array,
      },

  },
  data() {
    return {

      defaultValue:{tag:'创建日期',filed:'t.create_time',asc:false} ,
        selectSortTags:[ ],
        defaultSortTags:this.sortTags,
        orderStr:'',
    };
  },
  mounted(){

  },
  created(){

    // this.selectSortTags = [this.defaultValue.tag]
    this. initSort();
  },
  methods: {

      initSort(){
        var that = this
        this.selectSortTags = [that.defaultValue.tag]
        var orderStr = ''
        var sortType = ''
        var orderItems = []
        var orderItem = {}
        this.defaultSortTags.forEach((element,i)=>{
          if(that.defaultValue.tag == element.tag ){
            sortType = 'desc'
            orderStr = `${element.filed+' ' + sortType}`
            orderItem={
              column:element.filed,
              asc:element.asc,
            }
            orderItems.push(orderItem)
            if(element.status==3){
              this.selectSortTags=[]
              orderStr = ''
              orderItems = []
            }
          }
        })
        this.orderStr =orderStr
        this.$forceUpdate()
        that.$emit('sortChange',orderStr,orderItems)
      },
      handleSortChange(item,checked){
      debugger
      var that = this
     var flag =  !this.selectSortTags.find(j=> {return j == item.tag}) ?false:true
      this.selectSortTags = [item.tag]
      var orderStr = ''
      var sortType = ''
      var orderItems = []
      var orderItem = {}
      this.defaultSortTags.forEach((element,i)=>{
          if(item.tag == element.tag ){

            if(flag ){
              if(element.status<2){
                  element.asc =  !element.asc
              }

              element.status ++
            }else{
              element.status = 1
            }
            if(element.asc){
               sortType = 'asc'
            }else{
              sortType = 'desc'
            }
            orderStr = `${element.filed+' ' + sortType}`
            orderItem={
              column:element.filed,
              asc:element.asc,
            }
            orderItems.push(orderItem)
            if(element.status==3){
              this.selectSortTags=[]
              orderStr = ''
              orderItems = []
            }
          }
      })
      this.orderStr =orderStr
      this.$forceUpdate()

      that.$emit('sortChange',orderStr,orderItems)


    },
  },
  computed:{
  },
  filters: {
  },
  watch:{
    orderStr(){

    }
  },

 }
</script>

<style scoped>
.ant-tag{
  font-size: 14px;
}
</style>
